<script>
import { useCounter, useMouse } from '@/hooks'

const { x, y, mixins: mouseMixins } = useMouse()
const { countIn, mixins: countMixins } = useCounter(10)

export default {
  name: 'TestHook',
  components: {},
  props: {},
  mixins: [mouseMixins, countMixins],
  data() {
    return {
      mouseX: x,
      mouseY: y,
      countIn,
    }
  },
  watch: {
    'countIn.value': {
      handler(val) {
        console.log('countIn变化：', val)
      },
    },
  },
  onLoad() {
    console.log('component onLoad')
  },
  mounted() {
    console.log('component mounted')
    // getOpenerEventChannel 只能在页面的生命周期中调用
    //const eventChannel = this.getOpenerEventChannel?.()
    //eventChannel?.on('acceptDataFromOpenerPage', function (data) {
    //  console.log(data)
    //})
    uni.$on('hello-event', (data) => {
      console.log({ data }, 'zqj')
    })
  },
  beforeDestroy() {
    console.log('component beforeDestroy')
  },
  destroyed() {
    console.log('component destroyed ')
  },
}
</script>

<template>
  <div class="example">
    <div>({{ mouseX }}, {{ mouseY }})</div>
    <p>count {{ countIn }} doubleCount {{ doubleCountIn }}</p>
    <button @click="addIn(1)">+</button>
  </div>
</template>
